<style tyle="text/css">
  .mt10 {
    margin-top: 10px
  }
  .dropdown-menu .p5_15:hover {
    background-color: #edf1f2 !important;
    background-image: none;
    filter: none;
    cursor: pointer;
  }
  .p5_15 {
    padding: 5px 15px;
  }
  .dropdown-btn {
    float: left;
    margin-top: 3px;
  }
  .dropdown-menu li {
    white-space: nowrap;
  }
</style>
<div class="col-sm-12 mt20">
  <!-- 页面头部搜索条件 -->
  <div class="panel panel-body">
    <div class="col-lg-12">
      <div class="col-lg-2">
        <label class="form-control-static pull-right">查询起止时间：</label>
      </div>
      <div class="col-lg-2-4">
        <div class="input-group" ng-click="dateOpen($event, date)">
          <input type="text" class="form-control" datepicker-popup="yyyy-MM-dd" ng-model="date.lable" is-open="date.opened"
            placeholder="开始时间" ng-required="true" close-text="关闭" current-text="今天" clear-text="清除" readonly/>
          <span class="input-group-btn">
            <button type="button" class="btn btn-default">
              <i class="glyphicon glyphicon-calendar"></i>
            </button>
          </span>
        </div>
      </div>
      <div class="col-lg-2-4">
        <div class="input-group" ng-click="dateOpen($event, date1)">
          <input type="text" class="form-control" datepicker-popup="yyyy-MM-dd" ng-model="date1.lable" is-open="date1.opened" 
            placeholder="结束时间" ng-required="true" close-text="关闭" current-text="今天" clear-text="清除" readonly/>
          <span class="input-group-btn">
            <button type="button" class="btn btn-default">
              <i class="glyphicon glyphicon-calendar"></i>
            </button>
          </span>
        </div>
      </div>
    </div>
    <div class="col-lg-12 mt10">
      <div class="col-lg-2">
        <label class="control-label pull-right">选择显示结果：</label>
      </div>
      <div class="col-lg-10">
        <span ng-repeat="item in resultList" style="margin-right: 15px">
          <label class="i-checks m-b-none">
            <input type="checkbox" ng-model="item.check"><i></i>{{item.label}}
          </label>
        </span>
      </div>
    </div>
    <div class="col-lg-12 mt10">
      <div class="col-lg-2 pull-right">
        <button type="button" class="btn btn-info search form-control" ng-click="load()">立即搜索</button>
      </div>
    </div>
  </div>

  <!-- 网速太慢,画圈等 -->
  <h3 class="col-sm-12 text-center" ng-show="fromData.loading">
    <i class="fa fa-spin fa-spinner hide show inline"/>
  </h3>

  <!-- 统计数据 -->
  <div class="panel panel-default table-responsive" ng-show="!fromData.loading" style="min-height: 200px;">
    <h3 class="col-sm-12 text-center" ng-show="fromData.selectedList.length == 0">
      <i class="fa fa-coffee"/> 无统计数据
    </h3>

    <table class="table table-striped table-bordered" ng-show="fromData.selectedList.length != 0">
      <thead>
        <tr>
          <th class="text-right" ng-repeat="item in fromData.selectedList" ng-style="setStyle(item)">
            <div class="dropdown-btn">{{item.label}}</div>
            <div class="btn-group dropdown" dropdown="" ng-if="filters[item.value]">
                <!-- ng-click="item.open = !item.open" ng-class="{'open': item.open}"  -->
              <button class="btn btn-default btn-xs" dropdown-toggle="" ><span class="caret"/></button>
              <ul class="dropdown-menu pull-right">
                <li class="p5_15" ng-repeat="(key, flag) in filters[item.value]" ng-click="filterType(key, flag, filters[item.value], item.value)">
                  <div class="i-checks m-b-none">  
                    <input type="checkbox" ng-model="flag"><i></i>{{key}}
                  </div>
                </li>
              </ul>
            </div>
          </th>
          <th class="text-center" style="min-width: 80px">总金额</th>
          <th class="text-center" style="min-width: 90px">购买数量</th>
          <th class="text-center" style="min-width: 90px">使用数量</th>
          <th class="text-center" style="min-width: 90px">退票数量</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="info in saleList | filter: {'show': true}">
          <td ng-repeat="item in fromData.selectedList" class={{item.align}}>
            <span ng-show="item.more != 1">{{info[item.more]}}<br/></span>
            <span ng-show="item.value != 'unit_price'">{{info[item.value]}}</span>
            <span ng-show="item.value == 'unit_price'">{{info[item.value] / 100 | number: 2 | currency : '￥'}}</span>
          </td>
          <td class="text-center">{{info.down_price / 100 | number: 2 | currency : '￥'}}</td>
          <td class="text-center">{{info.buy}}</td>
          <td class="text-center">{{info.used}}</td>
          <td class="text-center">{{info.back}}</td>
        </tr>
        <tr>
          <td ng-repeat="item in fromData.selectedList" class="text-center">
            <span ng-show="$index == 0">合计</span>
          </td>
          <td class="text-center">{{fromData.total.price / 100 | number: 2 | currency : '￥'}}</td>
          <td class="text-center">{{fromData.total.buy}}</td>
          <td class="text-center">{{fromData.total.used}}</td>
          <td class="text-center">{{fromData.total.back}}</td>
        </tr>
      </tbody>
    </table>

  </div>
</div>